<!--专家师资-专家师资-->
<template>
  <div>
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/index' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>专家师资</el-breadcrumb-item>
    </el-breadcrumb>
    <div>
      <el-form :inline="true" class="user-search">
        <el-form-item label="讲师名称：">
          <el-input size="small" style="width: 200px;" placeholder="请输入" />
        </el-form-item>
        <el-form-item label="专家领域：">
          <el-select v-model="type.value" size="small" placeholder="请选择" style="width: 120%">
            <el-option v-for="item in type" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="操作">
          <el-button size="small" type="primary" icon="el-icon-search" @click="search">搜索</el-button>
          <el-button size="small" type="primary" icon="el-icon-search" @click="clan">重置</el-button>
       </el-form-item>
      </el-form>
    </div>
    <el-button type="primary" size="small" @click="openTeacherEdit">+添加师资</el-button>
    <hr>
    <el-table size="small" :data="filteredData" border style="width: 100%">
      <el-table-column label="序号" type="index" align="center"></el-table-column>
      <el-table-column prop="bt_name" label="讲师名称" width="100px" />
      <el-table-column prop="bt_zhicheng" label="职称" width="100px" />
      <el-table-column prop="bt_zyly" label="专业领域" width="200px" />
      <el-table-column prop="bt_addr" label="所在地区" width="220px" />
      <el-table-column prop="bt_phoneno" label="联系方式" width="150px" />
      <el-table-column prop="bt_workdate" label="参加工作时间" width="200px" />
<!--      <el-table-column prop="" label="已发布课程" width="150px" />-->
      <el-table-column prop="bt_code" label="操作" width="150px">
        <template v-slot="scope">
          <el-button size="mini" type="danger" @click="teachersEdit(scope.$index, scope.row)">编辑</el-button>
<!--          <el-button size="mini" @click="qyDelete(scope.$index, scope.row)">{{ scope.row.gwi_shenhestate === 1 ? '上架' : '下架' }}</el-button>-->
          <el-button size="mini" @click="teacherDelete(scope.$index, scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { defineComponent, ref } from 'vue'
import {deletebt, querybtlist} from '../../api/InstitutionApi'
export default defineComponent({
  name: "Management",
  data() {
    return {
      type: [
        {
          value: '0',
          label: '养老院'
        }, {
          value: '1',
          label: '教育机构'
        },
      ],
      promotion: [],
      // 存储具体数据
      tableDate: []
    }
  },
  computed: {
    filteredData() {
      let result = this.tableDate;
      // 按专家领域过滤
      if (this.type.value) {
        result = result.filter(item => item.bt_zyly === this.type.value);
      }
      // 可以添加其他过滤条件
      // if (this.otherFilter) {
      //   result = result.filter(item => item.other === this.otherFilter);
      // }
      return result;
    }
  },

  created() {
    this.getdata()
  },

  methods: {
    getdata() {
      querybtlist({}).then(res => {
        // this.tableDate = res.data.base_info;
        console.log('讲师列表：', res);
        this.tableDate = res.data.data.base_info
      })
    },
    // 添加新的师资
    openTeacherEdit() {
      this.$router.push({
        path: '/teachers/teacherEdit',
        query: ''
      });
    },
    // 跳转到师资编辑
    teachersEdit(index,row) {
      // console.log('查看：',flowid)
      // 跳转页面的三种方式
      // 方式1：通过 path 跳转
      // this.$router.push({
      //   path: `/enterprises/EnEdit/:index`
      // });
      // 方式2：通过 name 跳转（推荐）
      // this.$router.push({
      //   name: 'enedit',
      //   params: { index: index }
      // });
      // 方式3：带查询参数（显示在URL中）
      this.$router.push({
        path: '/teachers/teacherEdit',
        query: { teacherCode: row }
      });
    },
    // 删除讲师基础信息
    teacherDelete(index,row) {
      deletebt({
        "btcode" : row.bt_code
      }).then(res => {
        console.log("index:",res)
        this.getdata()
      })

    }
  },
})
</script>
<style scoped>
.option-box {
  margin-top: 1%;

  span {
    margin-left: 1%;
  }

  .el-button {
    width: 5%;
  }
}
.el-table {
  margin-top: 1%;
}

.el-pagination {
  margin-top: 1%;
  float: right;
}
</style>

